/*全局变量*/
$i_font: 28px; // 全局i标签大小
@mixin  i_style{
  i {
    font-size: $i_font;
  }
}
@mixin input_style{  // 混入
  display: flex;
  color: #C7CCD3;
  border-bottom: 2px solid #EEEEF2;
  align-items: center;
  margin-bottom: 6vh;
  input {
    padding-left: 10px;
    border: 0;
    color: #99A2B0;
    background: #F8F8F8;
    width: 90%;
    height: 3vh;
    font-size: 20px;
  }
}
.login{
  width: 100vw;
  height: 100vh;
  display: flex;
  .left-img{
    flex: 6;
    background: #FFFFFF;
    //padding-bottom: 2px;
    img {
      width: 100%;
      height: 99%;
    }
  }
  .right {
    flex: 4;
    background: #F8F8F8;
    display: flex;
    box-sizing: content-box;
    //background: #45b29d;
    justify-content: center;
    align-items: center;
    //padding: 20vh 10vw;
    .right-form {
       width: 60%;
       height: 60%;
      .form-title {
        margin-top: 2vh;
        text-align: center;
        h1 {
          color: #44556F;
          letter-spacing: 0.5rem;
          font-family: "微软雅黑 Light";
          font-weight: bold;
          font-size: 2rem;
          margin-top: 0.5vh;
        }
        .form-small-title {
          margin-top: 2vh;
          color: #BDC2CA;
        }
      }
      .form-input {
        margin-top: 8vh;
        padding: 0 2vw;
        @include i_style;
        .form-user {
          @include input_style;
        }
        .form-pass {
          @include input_style;
        }
        .form-checks {
          display: flex;
          color: #616E84;
          justify-content: space-between;
          margin-bottom: 4vh;
        }
      }
      .form-btn {
        padding: 0 2vw;
        button {
          width: 100%;
          height: 5vh;
          font-size: 18px;
          background: #226AD5;
          color: #fff;
          border-radius: 4px;
          border: 0;
        }
      }
    }
    .right-bottom {
      position: absolute;

      bottom: 2vh;
      color: #8D8E96;
    }
  }
}
